<!DOCTYPE html>
<html>
<head>
	<title>手机登录</title>
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="__PUBLIC__/css/bootstrap.min.css">
<style type="text/css">
body{
	background: #C0C0C0;
}
.login{
	width: 500px;
	height: 350px;
	position:absolute;  
	left:50%;  
	top:50%;  
	margin:-175px 0 0 -250px;
	background: white;
	border-radius:25px;
	box-shadow: 0px 0px 50px #888888;
}
.title{
	font-size: 60px;
	color: white;
	border-radius:25px 25px 0px 0px;
	height: 80px;
	background: #F85252;
}
#box{
	margin-top:20px;
	padding: 30px;
}
.input-group{
	padding:15px;
}

#loginform{
	width: 440px;
	margin-top:20px;
}
@media(max-width: 500px){
	.login{
		width: 100%;
		left: 0;
		margin:-175px 0 0 0;
	}
	#loginform{
		width: 90%;
		margin-top:20px;
	}
}
</style>
</head>
<body>
<div class="login">
	<div class="title">Login</div>
	<form action="" method="post">
	<div id="box">
		<div class="input-group">
			<span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
			<input class="form-control" type="text" placeholder="Enter user" name="user" maxlength="14">
		</div>
		<div class="input-group">
			<span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
			<input class="form-control" type="password" placeholder="password" name="password" maxlength="14">
		</div>
		<input type="submit" name="" value="login" class="btn btn-info" id="loginform">
	</div>
</div>
</body>
</html>